/* =====================================================
   GI2 PAWS MOBILE LARGE
   For 431 - 768px
   Do not write @media in this file.
   ===================================================== */


/* ===== HOME FULL CONTROL END =================================================================================================== */

/* 整个 Home Hero 区域 */
body.home-page .hero.section-pad.reveal {
  position: relative !important; /* 让 hero 里面的文字可以移动 */
  overflow: hidden !important; /* 防止图片或内容跑出 hero 外面 */

  width: 100vw !important; /* hero 满手机宽度 */
  max-width: 100vw !important; /* 防止旧 CSS 限制宽度 */

  height: clamp(100px, 72vh, 700px) !important; /* hero 高度：最小560，中间跟手机高度，最大700 */
  min-height: 100px !important; /* 最小高度 */
  max-height: 700px !important; /* 最大高度 */

  margin-top: 0 !important; /* hero 上方距离 */
  margin-right: calc(50% - 50vw) !important; /* 贴齐右边 */
  margin-bottom: 0 !important; /* hero 下方距离 */
  margin-left: calc(50% - 50vw) !important; /* 贴齐左边 */

  padding-top: clamp(46px, 8vh, 70px) !important; /* 上方空间，影响文字高度 */
  padding-right: 20px !important; /* 右边空间 */
  padding-bottom: 32px !important; /* 下方空间 */
  padding-left: 20px !important; /* 左边空间 */

  border-radius: 0 !important; /* mobile hero 不要圆角 */
  box-sizing: border-box !important; /* padding 不撑爆 */

  display: flex !important; /* 让内容可以定位 */
  align-items: flex-start !important; /* 内容靠上 */
  justify-content: flex-start !important; /* 内容靠左 */

  background:
    linear-gradient(
      180deg,
      rgba(255, 248, 238, 0.82) 0%, /* 上方遮罩，让文字清楚 */
      rgba(255, 248, 238, 0.56) 36%, /* 中间遮罩 */
      rgba(255, 248, 238, 0.10) 100% /* 下方遮罩 */
    ),
    url("assets/hero-pets-mobile.png") !important; /* mobile hero 图片 */

  background-size: cover !important; /* 图片填满 */
  background-position: center bottom !important; /* 图片靠下 */
  background-repeat: no-repeat !important; /* 图片不重复 */
}

/* 关掉旧 overlay */
body.home-page .hero.section-pad.reveal::before,
body.home-page .hero.section-pad.reveal::after {
  display: none !important; /* 隐藏旧遮罩 */
  content: none !important; /* 清掉旧伪元素 */
  background: none !important; /* 清掉旧背景 */
}

/* Hero 文字整组 */
body.home-page .hero.section-pad.reveal .hero-copy {
  position: relative !important; /* 让整组文字可以移动 */
  left: 0px !important; /* 整组文字左右移动 */
  top: clamp(0px, 1vh, 22px) !important; /* 整组文字上下移动：数字越大越往下 */

  width: 100% !important; /* 文字区宽度 */
  max-width: min(360px, 88vw) !important; /* 文字区最大宽度 */

  margin: 0 !important; /* 清掉外距 */
  padding: 0 !important; /* 清掉内距 */

  text-align: left !important; /* 文字靠左 */
  z-index: 2 !important; /* 文字在图片上方 */
}

/* Hero 小字 */
body.home-page .hero.section-pad.reveal .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 0px !important; /* 小字左右移动 */
  top: 0px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: clamp(12px, 3.8vw, 14px) !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-right: 0 !important; /* 右边距离 */
  margin-bottom: 12px !important; /* 和标题距离 */
  margin-left: 0 !important; /* 左边距离 */
}

/* Hero 大标题 */
body.home-page .hero.section-pad.reveal h1 {
  position: relative !important; /* 让标题可以移动 */
  left: 0px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #ffffff !important; /* 标题颜色 */
  font-size: clamp(25px, 10vw, 33px) !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 0.98 !important; /* 标题行高 */
  letter-spacing: -0.03em !important; /* 标题字距 */

  max-width: min(340px, 88vw) !important; /* 标题宽度 */

  margin-top: 0 !important; /* 上方距离 */
  margin-right: 0 !important; /* 右边距离 */
  margin-bottom: 16px !important; /* 和说明文字距离 */
  margin-left: 0 !important; /* 左边距离 */

  text-align: left !important; /* 标题靠左 */
  text-shadow: 0 4px 18px rgba(23, 77, 50, 0.28) !important; /* 白字阴影 */
}

/* Hero 说明文字 */
body.home-page .hero.section-pad.reveal .hero-text,
body.home-page .hero.section-pad.reveal p {
  position: relative !important; /* 让说明文字可以移动 */
  left: 0px !important; /* 说明文字左右移动 */
  top: 0px !important; /* 说明文字上下移动 */

  color: #3f3a33 !important; /* 说明文字颜色 */
  font-size: clamp(12px, 4vw, 12.5px) !important; /* 说明文字大小 */
  font-weight: 650 !important; /* 说明文字粗细 */
  line-height: 1.55 !important; /* 说明文字行高 */

  max-width: min(340px, 88vw) !important; /* 说明文字宽度 */

  margin-top: 0 !important; /* 上方距离 */
  margin-right: 0 !important; /* 右边距离 */
  margin-bottom: 14px !important; /* 下方距离 */
  margin-left: 0 !important; /* 左边距离 */

  text-align: left !important; /* 文字靠左 */
}

/* Hero button 整组 */
body.home-page .hero.section-pad.reveal .hero-actions {
  display: none !important; /* 隐藏 Shop Now / Shop Products button */
}

/* Product Highlight 内容容器 */
body.home-page #tofu-litter .home-highlight-product {
  display: flex !important; /* mobile 上下排列 */
  flex-direction: column !important; /* 文字和图片上下排 */
  gap: 22px !important; /* 文字区和图片区距离 */

  width: 100% !important; /* 容器宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  margin: 0 auto !important; /* 居中 */
  padding: 0 !important; /* 清掉旧 padding */
}

/* 小字 Product Highlight */
body.home-page #tofu-litter .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 0px !important; /* 小字左右移动 */
  top: 0px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 13px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-bottom: 10px !important; /* 小字和标题距离 */
}

/* 大标题 */
body.home-page #tofu-litter h2 {
  position: relative !important; /* 让标题可以移动 */
  left: 0px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 27px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.12 !important; /* 标题行高 */
  letter-spacing: -0.02em !important; /* 标题字距 */

  margin-top: 0 !important; /* 标题上方距离 */
  margin-bottom: 14px !important; /* 标题和说明文字距离 */
}

/* 描述文字 */
body.home-page #tofu-litter .home-highlight-product > div:first-child > p:not(.eyebrow) {
  position: relative !important; /* 让描述可以移动 */
  left: 0px !important; /* 描述左右移动 */
  top: 5px !important; /* 描述上下移动 */

  color: #5b6858 !important; /* 描述颜色 */
  font-size: 14.5px !important; /* 描述文字大小 */
  font-weight: 500 !important; /* 描述粗细 */
  line-height: 1.65 !important; /* 描述行高 */

  margin-top: 0 !important; /* 描述上方距离 */
  margin-bottom: 16px !important; /* 描述和价钱表距离 */
}

/* 价钱表 */
body.home-page #tofu-litter div.notice-box {
  position: relative !important; /* 让价钱表可以移动 */
  left: 0px !important; /* 价钱表左右移动 */
  top: -20px !important; /* 价钱表上下移动：负数往上，正数往下 */

  width: 100% !important; /* 价钱表宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  margin-top: 0 !important; /* 价钱表上方距离 */
  margin-bottom: 12px !important; /* 价钱表和按钮距离 */

  padding: 14px 16px !important; /* 价钱表里面空间：上下 / 左右 */

  border-radius: 18px !important; /* 价钱表圆角 */
  background: rgba(255, 255, 255, 0.84) !important; /* 价钱表背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 价钱表边框 */
  box-shadow: 0 14px 34px rgba(23, 77, 50, 0.07) !important; /* 价钱表阴影 */
}

/* 价钱文字 */
body.home-page #tofu-litter div.notice-box strong {
  display: block !important; /* 价钱独占一行 */
  font-size: 16px !important; /* 价钱字体大小 */
  font-weight: 900 !important; /* 价钱粗细 */
  color: #174d32 !important; /* 价钱颜色 */
  margin-bottom: 7px !important; /* 价钱和说明距离 */
}

/* 价钱表说明文字 */
body.home-page #tofu-litter div.notice-box span {
  display: block !important; /* 说明独占一行 */
  font-size: 14px !important; /* 说明字体大小 */
  color: #5b6858 !important; /* 说明颜色 */
  line-height: 1.55 !important; /* 说明行高 */
}

/* View Details 按钮区域 */
body.home-page #tofu-litter .hero-actions {
  position: relative !important; /* 让按钮区域可以移动 */
  left: 0px !important; /* 按钮左右移动 */
  top: -60px !important; /* 按钮上下移动：跟价钱表一起 */

  display: flex !important; /* 显示按钮 */
  justify-content: flex-start !important; /* 按钮靠左 */
  align-items: center !important; /* 按钮上下居中 */

  margin-top: 6px !important; /* 按钮和价钱表距离 */
  margin-bottom: 0px !important; /* 按钮下方距离 */
}

/* View Details 按钮本身 */
body.home-page #tofu-litter .hero-actions .btn {
  width: 150px !important; /* 按钮宽度 */
  height: 42px !important; /* 按钮高度 */

  display: none !important; /* 让按钮文字居中 */
  align-items: center !important; /* 文字上下居中 */
  justify-content: center !important; /* 文字左右居中 */

  font-size: 14px !important; /* 按钮文字大小 */
  font-weight: 900 !important; /* 按钮文字粗细 */
  text-align: center !important; /* 文字居中 */
}

/* 猫砂图片框 */
body.home-page #tofu-litter .home-highlight-image-box {
  position: relative !important; /* 让图片框可以移动 */
  left: 0px !important; /* 图片框左右移动 */
  top: auto !important; /* 不用 top 移动 */

  margin-top: -160px !important; /* 图片框真正上下移动：负数往上 */
  margin-bottom: 0px !important; /* 图片框下面空间 */
  transform: none!important; /* 图片框视觉移动：负数往上 */

  width:  225px!important; /* 图片框宽度 */
  max-width: 225px!important; /* 不超过手机宽度 */

  height: 230px !important; /* 图片框高度 */
  min-height: 230px !important; /* 图片框最小高度 */
  max-height: 230px !important; /* 图片框最大高度 */

  padding: 12px !important; /* 图片和框边缘距离 */

  border-radius: 22px !important; /* 图片框圆角 */
  background: rgba(255, 255, 255, 0.78) !important; /* 图片框背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 图片框边框 */
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.08) !important; /* 图片框阴影 */

  overflow: hidden !important; /* 图片不要跑出框 */
  animation: none !important; /* 关闭旧动画 */
}

/* 猫砂图片本身 */
body.home-page #tofu-litter .home-highlight-image-box img.card-product-photo {
    position: relative !important; /* 让图片本身可以移动 */
    left: 0px !important; /* 图片左右移动 */
    top: -20px !important; /* 图片上下移动 */
    border-radius: 0px !important; 

  width: 100% !important; /* 图片宽度 */
  height: 100% !important; /* 图片高度 */
  object-fit: contain !important; /* 完整显示猫砂 */
  object-position: center center !important; /* 图片位置 */
  display: block !important; /* 去掉图片底部空隙 */
}

/* 整个 How to Order section */
body.home-page section#order {
  position: relative !important; /* 让整块可以移动 */
  left: 0px !important; /* 整块左右移动 */
  top: 45px !important; /* 整块上下移动 */

  padding-top: 46px !important; /* 整块上方空间 */
  padding-right: 20px !important; /* 右边空间 */
  padding-bottom: 48px !important; /* 整块下方空间 */
  padding-left: 20px !important; /* 左边空间 */

  margin-top: 0px !important; /* 和上一个 section 距离 */
  margin-bottom: 0px !important; /* 和下一个 section 距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* How to Order container */
body.home-page section#order .container {
  position: relative !important; /* 让 container 可以移动 */
  left: 0px !important; /* container 左右移动 */
  top: 0px !important; /* container 上下移动 */

  width: 100% !important; /* container 宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  margin: 0 auto !important; /* 居中 */
  padding: 0 !important; /* 清掉旧 padding */
}

/* 标题区域 */
body.home-page section#order .section-heading {
  position: relative !important; /* 让标题区域可以移动 */
  left: 0px !important; /* 标题区域左右移动 */
  top: 0px !important; /* 标题区域上下移动 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 24px !important; /* 标题区域和卡片距离 */

  text-align: left !important; /* 文字靠左 */
}

/* 小字 HOW TO ORDER */
body.home-page section#order .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 0px !important; /* 小字左右移动 */
  top: 0px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 13px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 10px !important; /* 小字和标题距离 */
}

/* How to Order 大标题 */
body.home-page section#order h2 {
  position: relative !important; /* 让标题可以移动 */
  left: 0px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 29px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.12 !important; /* 标题行高 */
  letter-spacing: -0.02em !important; /* 标题字距 */

  margin-top: 0 !important; /* 标题上方距离 */
  margin-bottom: 14px !important; /* 标题和说明文字距离 */
}

/* 标题下面说明文字 */
#order .section-heading p {
  position: relative !important; /* 让说明可以移动 */
  left: 0px !important; /* 说明左右移动 */
  top: 0px !important; /* 说明上下移动 */

  color: #5b6858 !important; /* 说明文字颜色 */
  font-size: 15px !important; /* 说明文字大小 */
  font-weight: 500 !important; /* 说明文字粗细 */
  line-height: 1.65 !important; /* 说明文字行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 0 !important; /* 下方距离 */
}

/* How to Order 卡片区域 */
body.home-page section#order .grid,
body.home-page section#order .order-grid,
body.home-page section#order .steps-grid {
  position: relative !important; /* 让卡片整组可以移动 */
  left: 0px !important; /* 卡片整组左右移动 */
  top: 0px !important; /* 卡片整组上下移动 */

  display: grid !important; /* 用 grid 排列 */
  grid-template-columns: 1fr !important; /* mobile 一行一个 */
  gap: 14px !important; /* 卡片之间距离 */

  width: 100% !important; /* 卡片区域宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  margin: 0 !important; /* 清掉旧 margin */
  padding: 0 !important; /* 清掉旧 padding */
}

/* 每个步骤卡片 */
body.home-page section#order article,
body.home-page section#order .step-card,
body.home-page section#order .order-card,
body.home-page section#order .info-card {
  position: relative !important; /* 让单个卡片可以移动 */
  left: 0px !important; /* 卡片左右移动 */
  top: 0px !important; /* 卡片上下移动 */

  width: 100% !important; /* 卡片宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  min-height: 160px !important; /* 卡片最小高度 */
  max-height: 500px !important; /* 卡片最小高度 */
  height: 118px !important; /* 卡片高度自动 */

  padding-top: 16px !important; /* 卡片里面上方空间 */
  padding-right: 16px !important; /* 卡片里面右边空间 */
  padding-bottom: 16px !important; /* 卡片里面下方空间 */
  padding-left: 16px !important; /* 卡片里面左边空间 */

  margin: 0 !important; /* 清掉旧外距 */

  border-radius: 20px !important; /* 卡片圆角 */
  background: rgba(255, 255, 255, 0.84) !important; /* 卡片背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 卡片边框 */
  box-shadow: 0 14px 34px rgba(23, 77, 50, 0.07) !important; /* 卡片阴影 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* 步骤号码，例如 01 / 02 / 03 */
body.home-page section#order .step-number,
body.home-page section#order .step-badge,
body.home-page section#order article > span:first-child {
  position: relative !important; /* 让号码可以移动 */
  left: 0px !important; /* 号码左右移动 */
  top: 0px !important; /* 号码上下移动 */

  width: 34px !important; /* 号码圆圈宽度 */
  height: 34px !important; /* 号码圆圈高度 */

  display: inline-flex !important; /* 让号码居中 */
  align-items: center !important; /* 号码上下居中 */
  justify-content: center !important; /* 号码左右居中 */

  border-radius: 999px !important; /* 号码圆形 */
  background: #922872 !important; /* 号码背景 */
  color: #ffffff !important; /* 号码颜色 */

  font-size: 15px !important; /* 号码大小 */
  font-weight: 900 !important; /* 号码粗细 */
  line-height: 1 !important; /* 号码行高 */

  margin-bottom: 10px !important; /* 号码和卡片标题距离 */
}

/* 卡片标题 */
body.home-page section#order article h3,
body.home-page section#order .step-card h3,
body.home-page section#order .order-card h3,
body.home-page section#order .info-card h3 {
  position: relative !important; /* 让卡片标题可以移动 */
  left: 45px !important; /* 卡片标题左右移动 */
  top: -40px !important; /* 卡片标题上下移动 */

  color: #174d32 !important; /* 卡片标题颜色 */
  font-size: 18px !important; /* 卡片标题大小 */
  font-weight: 900 !important; /* 卡片标题粗细 */
  line-height: 1.25 !important; /* 卡片标题行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 8px !important; /* 标题和文字距离 */
}

/* 卡片说明文字 */
body.home-page section#order article p,
body.home-page section#order .step-card p,
body.home-page section#order .order-card p,
body.home-page section#order .info-card p {
  position: relative !important; /* 让文字可以移动 */
  left: 0px !important; /* 文字左右移动 */
  top: -30px !important; /* 文字上下移动 */

  color: #5b6858 !important; /* 文字颜色 */
  font-size: 14px !important; /* 文字大小 */
  font-weight: 500 !important; /* 文字粗细 */
  line-height: 1.55 !important; /* 文字行高 */

  margin: 0 !important; /* 清掉旧 margin */
}

/* 整个 Marketplace section */
body.home-page #marketplace,
body.home-page .marketplace-section {
  position: relative !important; /* 让整块可以移动 */
  left: 0px !important; /* 整块左右移动 */
  top: 45px !important; /* 整块上下移动 */

  padding-top: 20px !important; /* 整块上方空间 */
  padding-right: 20px !important; /* 右边空间 */
  padding-bottom: 20px !important; /* 整块下方空间 */
  padding-left: 20px !important; /* 左边空间 */

  margin-top: 0px !important; /* 跟上一个 section 距离 */
  margin-bottom: 0px !important; /* 跟下一个 section 距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* Marketplace 白色卡片 */
body.home-page #marketplace .marketplace-card,
body.home-page .marketplace-section .marketplace-card {
  position: relative !important; /* 让卡片可以移动 */
  left: 0px !important; /* 卡片左右移动 */
  top: 0px !important; /* 卡片上下移动 */

  width: 100% !important; /* 卡片宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */
  height: 200px !important; /* 卡片宽度 */
  max-height: 100% !important; /* 不超过手机宽度 */

  padding-top: 15px !important; /* 卡片里面上方空间 */
  padding-right: 22px !important; /* 卡片里面右边空间 */
  padding-bottom: 15px !important; /* 卡片里面下方空间 */
  padding-left: 22px !important; /* 卡片里面左边空间 */

  margin-top: 0px !important; /* 卡片上方距离 */
  margin-bottom: 0px !important; /* 卡片下方距离 */

  border-radius: 24px !important; /* 卡片圆角 */
  background: rgba(255, 255, 255, 0.78) !important; /* 卡片背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 卡片边框 */
  box-shadow: 0 18px 45px rgba(23, 77, 50, 0.08) !important; /* 卡片阴影 */

  display: flex !important; /* 让内容可以排列 */
  flex-direction: column !important; /* mobile 上下排 */
  align-items: flex-start !important; /* 内容靠左 */
  gap: 18px !important; /* 文字和按钮距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* 小字 MARKETPLACE */
body.home-page #marketplace .eyebrow,
body.home-page .marketplace-section .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 0px !important; /* 小字左右移动 */
  top: 0px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 13px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0px !important; /* 上方距离 */
  margin-bottom: 10px !important; /* 小字和标题距离 */
}

/* Marketplace 标题 */
body.home-page #marketplace h2,
body.home-page .marketplace-section h2 {
  position: relative !important; /* 让标题可以移动 */
  left: 0px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 28px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.15 !important; /* 标题行高 */
  letter-spacing: -0.02em !important; /* 标题字距 */

  margin-top: 0px !important; /* 标题上方距离 */
  margin-bottom: 12px !important; /* 标题和说明距离 */
}

/* Marketplace 描述文字 */
body.home-page #marketplace p:not(.eyebrow),
body.home-page .marketplace-section p:not(.eyebrow) {
  position: relative !important; /* 让文字可以移动 */
  left: 0px !important; /* 文字左右移动 */
  top: 0px !important; /* 文字上下移动 */

  color: #5b6858 !important; /* 描述颜色 */
  font-size: 15px !important; /* 描述大小 */
  font-weight: 500 !important; /* 描述粗细 */
  line-height: 1.65 !important; /* 描述行高 */

  margin-top: 0px !important; /* 上方距离 */
  margin-bottom: 0px !important; /* 下方距离 */
}

/* Marketplace 按钮整组 */
body.home-page #marketplace .marketplace-buttons,
body.home-page .marketplace-section .marketplace-buttons {
  position: relative !important; /* 让按钮整组可以移动 */
  left: 0px !important; /* 按钮整组左右移动 */
  top: 0px !important; /* 按钮整组上下移动 */

  width: 100% !important; /* 按钮区域宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  display: flex !important; /* 让按钮排列 */
  flex-direction: column !important; /* mobile 上下排 */
  align-items: flex-start !important; /* 按钮靠左；center = 中间 */
  gap: 10px !important; /* 按钮之间距离 */

  margin-top: 4px !important; /* 按钮和文字距离 */
  margin-bottom: 0px !important; /* 按钮下方距离 */

  padding: 0 !important; /* 清掉旧 padding */
}

/* Marketplace 所有按钮 */
body.home-page #marketplace .marketplace-link-pill,
body.home-page .marketplace-section .marketplace-link-pill {

  width: 140px !important; /* 按钮宽度 */
  min-width: 0px !important; /* 按钮最小宽度 */
  height: 42px !important; /* 按钮高度 */
  min-height: 42px !important; /* 按钮最小高度 */

  padding: 0 20px !important; /* 按钮里面空间 */

  display: inline-flex !important; /* 让按钮文字居中 */
  align-items: center !important; /* 文字上下居中 */
  justify-content: center !important; /* 文字左右居中 */

  border-radius: 999px !important; /* 按钮圆角 */
  font-size: 12px !important; /* 按钮文字大小 */
  font-weight: 900 !important; /* 按钮文字粗细 */
  line-height: 1 !important; /* 按钮文字行高 */
  text-align: center !important; /* 文字居中 */
  text-decoration: none !important; /* 去掉底线 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* Shopee 按钮 */
body.home-page #marketplace .marketplace-link-pill[href*="shopee"],
body.home-page .marketplace-section .marketplace-link-pill[href*="shopee"] {
  position: relative !important; /* 让按钮可以移动 */
  left: clamp(0px, 20vw, 30px) !important; /* 数字越大越往右 */
  top: clamp(-10px, 70vh, 0px) !important; /* 数字越大越往下 */

  background: #ca5806 !important; /* Shopee 背景 */
  color: #ffffff !important; /* Shopee 文字 */
  border: none !important; /* Shopee 边框 */
  box-shadow: 0 12px 28px rgba(23, 77, 50, 0.16) !important; /* Shopee 阴影 */
}

/* Lazada Coming Soon 按钮 */
body.home-page section#marketplace .marketplace-buttons a[href*="lazada"],
body.home-page .marketplace-section .marketplace-buttons a[href*="lazada"] {
  position: relative !important; /* 让按钮可以移动 */
  left: clamp(190px, 20vw, 400px) !important; /* 数字越大越往右 */
  top: clamp(-800px, 4vh, -52px) !important; /* 数字越大越往下 */

  background: #0627b9 !important; /* Lazada 背景 */
  color: #ffffff !important; /* Lazada 文字 */
  border: 1px solid rgba(242, 106, 46, 0.20) !important; /* Lazada 边框 */
  box-shadow: 0 10px 24px rgba(23, 77, 50, 0.08) !important; /* Lazada 阴影 */
}

/* 整个 FAQ section */
body.home-page section#faq {
  position: relative !important; /* 让整块可以移动 */
  left: 0px !important; /* 整块左右移动 */
  top: 45px !important; /* 整块上下移动 */

  padding-top: 46px !important; /* 整块上方空间 */
  padding-right: 20px !important; /* 右边空间 */
  padding-bottom: 52px !important; /* 整块下方空间 */
  padding-left: 20px !important; /* 左边空间 */

  margin-top: 0px !important; /* 跟上一个 section 距离 */
  margin-bottom: 0px !important; /* 跟下一个 section 距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* FAQ container */
body.home-page section#faq .container {
  position: relative !important; /* 让 container 可以移动 */
  left: 0px !important; /* container 左右移动 */
  top: 0px !important; /* container 上下移动 */

  width: 100% !important; /* container 宽度 */
  max-width: 100% !important; /* 不超过手机 */

  margin: 0 auto !important; /* 居中 */
  padding: 0 !important; /* 清掉旧 padding */
}

/* FAQ 标题区域 */
body.home-page section#faq .section-heading {
  position: relative !important; /* 让标题区可以移动 */
  left: 0px !important; /* 标题区左右移动 */
  top: 0px !important; /* 标题区上下移动 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 24px !important; /* 标题区和问题卡片距离 */

  text-align: left !important; /* 文字靠左 */
}

/* 小字 FAQ */
body.home-page section#faq .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 180px !important; /* 小字左右移动 */
  top: 0px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 13px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 10px !important; /* 小字和标题距离 */
}

/* FAQ 大标题 Common Questions */
body.home-page section#faq h2 {
  position: relative !important; /* 让标题可以移动 */
  left: 65px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 29px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.12 !important; /* 标题行高 */
  letter-spacing: -0.02em !important; /* 标题字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 14px !important; /* 标题和说明距离 */
}

/* FAQ 标题下面说明文字 */
#faq .section-heading p {
  position: relative !important; /* 让说明文字可以移动 */
  left: 0px !important; /* 说明左右移动 */
  top: 0px !important; /* 说明上下移动 */

  color: #5b6858 !important; /* 说明颜色 */
  font-size: 15px !important; /* 说明大小 */
  font-weight: 500 !important; /* 说明粗细 */
  line-height: 1.65 !important; /* 说明行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 0 !important; /* 下方距离 */
}

/* FAQ 问题列表 */
body.home-page section#faq .faq-list,
body.home-page section#faq .faq-grid,
body.home-page section#faq .grid {
  position: relative !important; /* 让整组问题可以移动 */
  left: 0px !important; /* 整组左右移动 */
  top: 0px !important; /* 整组上下移动 */

  display: grid !important; /* 用 grid 排列 */
  grid-template-columns: 1fr !important; /* mobile 一行一个 */
  gap: 14px !important; /* 每个问题之间距离 */

  width: 100% !important; /* 宽度 */
  max-width: 100% !important; /* 不超过手机 */

  margin: 0 !important; /* 清掉旧 margin */
  padding: 0 !important; /* 清掉旧 padding */
}

/* 每个 FAQ 卡片 */
body.home-page section#faq details,
body.home-page section#faq article,
body.home-page section#faq .faq-item,
body.home-page section#faq .question-card {
  position: relative !important; /* 让卡片可以移动 */
  left: 0px !important; /* 卡片左右移动 */
  top: 0px !important; /* 卡片上下移动 */

  width: 100% !important; /* 卡片宽度 */
  max-width: 100% !important; /* 不超过手机 */

  padding-top: 18px !important; /* 卡片里面上方空间 */
  padding-right: 18px !important; /* 卡片里面右边空间 */
  padding-bottom: 18px !important; /* 卡片里面下方空间 */
  padding-left: 18px !important; /* 卡片里面左边空间 */

  margin: 0 !important; /* 清掉旧外距 */

  border-radius: 20px !important; /* 卡片圆角 */
  background: rgba(255, 255, 255, 0.84) !important; /* 卡片背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 卡片边框 */
  box-shadow: 0 14px 34px rgba(23, 77, 50, 0.07) !important; /* 卡片阴影 */

  box-sizing: border-box !important; /* padding 不撑爆 */
  overflow: hidden !important; /* 内容不要跑出卡片 */
}

/* FAQ 问题标题 */
body.home-page section#faq summary,
body.home-page section#faq h3,
body.home-page section#faq .faq-question {
  position: relative !important; /* 让问题标题可以移动 */
  left: 0px !important; /* 问题标题左右移动 */
  top: 0px !important; /* 问题标题上下移动 */

  color: #174d32 !important; /* 问题标题颜色 */
  font-size: 16px !important; /* 问题标题大小 */
  font-weight: 900 !important; /* 问题标题粗细 */
  line-height: 1.35 !important; /* 问题标题行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 8px !important; /* 问题和答案距离 */

  padding: 0 !important; /* 清掉旧 padding */
  cursor: pointer !important; /* 可以点击 */
  list-style: none !important; /* 去掉默认小三角 */
}

/* 去掉 Chrome / Edge 默认三角 */
body.home-page section#faq summary::-webkit-details-marker {
  display: none !important;
}

/* FAQ 答案文字 */
body.home-page section#faq details p,
body.home-page section#faq article p,
body.home-page section#faq .faq-answer,
body.home-page section#faq .faq-item p,
body.home-page section#faq .question-card p {
  position: relative !important; /* 让答案可以移动 */
  left: 0px !important; /* 答案左右移动 */
  top: 0px !important; /* 答案上下移动 */

  color: #5b6858 !important; /* 答案颜色 */
  font-size: 14px !important; /* 答案大小 */
  font-weight: 500 !important; /* 答案粗细 */
  line-height: 1.65 !important; /* 答案行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 0 !important; /* 下方距离 */
}

/* FAQ 打开时 */
body.home-page section#faq details[open] {
  background: rgba(255, 255, 255, 0.92) !important; /* 打开时背景 */
  border-color: rgba(242, 106, 46, 0.20) !important; /* 打开时边框 */
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.09) !important; /* 打开时阴影 */
}

/* 整个 Ready To Ask section */
body.home-page section:has(a[href*="wa.me"]),
body.home-page section:has(a[href*="mailto"]) {
  position: relative !important; /* 让整块可以移动 */
  left: 0px !important; /* 整块左右移动 */
  top: 40px !important; /* 整块上下移动 */

  padding-top: 30px !important; /* 整块上方空间 */
  padding-right: 20px !important; /* 右边空间 */
  padding-bottom: 30px !important; /* 整块下方空间 */
  padding-left: 20px !important; /* 左边空间 */

  margin-top: 0px !important; /* 跟上一个 section 距离 */
  margin-bottom: 0px !important; /* 跟 footer 距离 */

  background:
    radial-gradient(circle at 18% 18%, rgba(23, 77, 50, 0.12), transparent 30%),
    radial-gradient(circle at 88% 18%, rgba(255, 106, 162, 0.07), transparent 28%),
    radial-gradient(circle at 82% 80%, rgba(255, 122, 40, 0.08), transparent 30%),
    linear-gradient(135deg, #eaf5dd 0%, #fff8ee 58%, #fff1e8 100%) !important; /* section 背景 */

  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* Ready To Ask container */
body.home-page section:has(a[href*="wa.me"]) .container,
body.home-page section:has(a[href*="mailto"]) .container {
  position: relative !important; /* 让 container 可以移动 */
  left: 0px !important; /* container 左右移动 */
  top: 0px !important; /* container 上下移动 */

  width: 100% !important; /* container 宽度 */
  max-width: 100% !important; /* 不超过手机 */

  height: 100% !important; /* container 宽度 */
  max-height: 250px !important; /* 不超过手机 */

  margin: 0 auto !important; /* 居中 */
  padding: 0 !important; /* 清掉旧 padding */
}

/* Ready To Ask 卡片 */
body.home-page section:has(a[href*="wa.me"]) article,
body.home-page section:has(a[href*="mailto"]) article,
body.home-page section:has(a[href*="wa.me"]) .cta-card,
body.home-page section:has(a[href*="mailto"]) .cta-card,
body.home-page section:has(a[href*="wa.me"]) .contact-card,
body.home-page section:has(a[href*="mailto"]) .contact-card {
  position: relative !important; /* 让卡片可以移动 */
  left: 0px !important; /* 卡片左右移动 */
  top: 0px !important; /* 卡片上下移动 */

  width: 100% !important; /* 卡片宽度 */
  max-width: 100% !important; /* 不超过手机 */

  padding-top: 26px !important; /* 卡片里面上方空间 */
  padding-right: 22px !important; /* 卡片里面右边空间 */
  padding-bottom: 26px !important; /* 卡片里面下方空间 */
  padding-left: 22px !important; /* 卡片里面左边空间 */

  margin: 0 auto !important; /* 卡片居中 */

  border-radius: 26px !important; /* 卡片圆角 */
  background: rgba(255, 255, 255, 0.74) !important; /* 卡片背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 卡片边框 */
  box-shadow: 0 18px 45px rgba(23, 77, 50, 0.09) !important; /* 卡片阴影 */
  backdrop-filter: blur(12px) !important; /* 玻璃效果 */

  box-sizing: border-box !important; /* padding 不撑爆 */
  text-align: left !important; /* 文字靠左 */
}

/* 小字 READY TO ASK */
body.home-page section:has(a[href*="wa.me"]) .eyebrow,
body.home-page section:has(a[href*="mailto"]) .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: 20px !important; /* 小字左右移动 */
  top: 20px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 12px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 10px !important; /* 小字和标题距离 */

  text-transform: uppercase !important; /* 大写 */
}

/* Ready To Ask 大标题 */
body.home-page section:has(a[href*="wa.me"]) h2,
body.home-page section:has(a[href*="mailto"]) h2 {
  position: relative !important; /* 让标题可以移动 */
  left: 15px !important; /* 标题左右移动 */
  top: 20px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 26px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.15 !important; /* 标题行高 */
  letter-spacing: -0.02em !important; /* 标题字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 14px !important; /* 标题和说明距离 */

  text-align: left !important; /* 标题靠左 */
}

/* Ready To Ask 描述文字 */
body.home-page section:has(a[href*="wa.me"]) p,
body.home-page section:has(a[href*="mailto"]) p {
  position: relative !important; /* 让文字可以移动 */
  left: 15px !important; /* 文字左右移动 */
  top: 20px !important; /* 文字上下移动 */

  width: 97% !important; /* 卡片宽度 */
  max-width: 100% !important; /* 不超过手机 */

  color: #5b6858 !important; /* 文字颜色 */
  font-size: 15px !important; /* 文字大小 */
  font-weight: 500 !important; /* 文字粗细 */
  line-height: 1.65 !important; /* 文字行高 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 18px !important; /* 文字和按钮距离 */

  text-align: left !important; /* 文字靠左 */
}

/* Ready To Ask 按钮整组 */
body.home-page section:has(a[href*="wa.me"]) .hero-actions,
body.home-page section:has(a[href*="mailto"]) .hero-actions,
body.home-page section:has(a[href*="wa.me"]) .cta-actions,
body.home-page section:has(a[href*="mailto"]) .cta-actions,
body.home-page section:has(a[href*="wa.me"]) .contact-actions,
body.home-page section:has(a[href*="mailto"]) .contact-actions {
  position: relative !important; /* 让按钮整组可以移动 */
  left: 0px !important; /* 按钮整组左右移动 */
  top: 0px !important; /* 按钮整组上下移动 */

  width: 100% !important; /* 按钮区宽度 */
  max-width: 100% !important; /* 不超过手机 */

  display: flex !important; /* 按钮排列 */
  flex-direction: column !important; /* mobile 上下排 */
  align-items: flex-start !important; /* 按钮靠左；center = 中间 */
  gap: 10px !important; /* 按钮之间距离 */

  margin-top: 4px !important; /* 按钮和文字距离 */
  margin-bottom: 0px !important; /* 下方距离 */

  padding: 0 !important; /* 清掉旧 padding */
}

/* Ready To Ask 所有按钮 */
body.home-page section:has(a[href*="wa.me"]) .btn,
body.home-page section:has(a[href*="mailto"]) .btn,
body.home-page section:has(a[href*="wa.me"]) a[role="button"],
body.home-page section:has(a[href*="mailto"]) a[role="button"] {

  width: 140px !important; /* 按钮宽度 */
  min-width: 0px !important; /* 按钮最小宽度 */
  height: 44px !important; /* 按钮高度 */
  min-height: 44px !important; /* 按钮最小高度 */

  padding: 0 22px !important; /* 按钮里面空间 */

  display: inline-flex !important; /* 让文字居中 */
  align-items: center !important; /* 文字上下居中 */
  justify-content: center !important; /* 文字左右居中 */

  border-radius: 999px !important; /* 胶囊圆角 */
  background: #174d32 !important; /* 按钮背景 */
  color: #ffffff !important; /* 按钮文字 */

  font-size: 14px !important; /* 按钮文字大小 */
  font-weight: 900 !important; /* 按钮文字粗细 */
  line-height: 1 !important; /* 按钮文字行高 */
  text-align: center !important; /* 文字居中 */
  text-decoration: none !important; /* 去掉底线 */
  white-space: nowrap !important; /* 不换行 */

  border: none !important; /* 去掉边框 */
  box-shadow: 0 12px 28px rgba(23, 77, 50, 0.16) !important; /* 按钮阴影 */
  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* WhatsApp 按钮 */
body.home-page section:has(a[href*="wa.me"]) a[href*="wa.me"] {
  position: relative !important; /* 让按钮可以移动 */
  left: -80px !important; /* 按钮左右移动 */
  top: -20px !important; /* 按钮上下移动 */
    
  background: #165933 !important; /* WhatsApp 背景 */
  color: #ffffff !important; /* WhatsApp 文字 */
  border: none !important; /* WhatsApp 边框 */
  box-shadow: 0 12px 28px rgba(47, 122, 79, 0.18) !important; /* WhatsApp 阴影 */
}

/* Email 按钮 */
body.home-page section:has(a[href*="mailto"]) a[href*="mailto"] {
  position: relative !important; /* 让按钮可以移动 */
  left: 80px !important; /* 按钮左右移动 */
  top: -77px !important; /* 按钮上下移动 */

  background: rgba(255, 255, 255, 0.86) !important; /* Email 背景 */
  color: #174d32 !important; /* Email 文字 */
  border: 1px solid rgba(23, 77, 50, 0.14) !important; /* Email 边框 */
  box-shadow: 0 10px 24px rgba(23, 77, 50, 0.08) !important; /* Email 阴影 */
}
/* ===== HOME FULL CONTROL END ============================================================================================================ */

/* ===== PRODUCT FULL CONTROL START ============================================================================================== */

/* ===== PRODUCT PAGE HERO 361-400 START ===== */

/* 整个 Product Page Hero */
section.product-mobile-hero.page-hero.section-pad.reveal {
  position: relative !important; /* 让 hero 可以移动 */
  left: 0px !important; /* hero 左右移动 */
  top: 0px !important; /* hero 上下移动 */

  width: 100vw !important; /* hero 满手机宽度 */
  max-width: 100vw !important; /* 不超过手机宽度 */

  height: 450px !important; /* hero 高度 */
  min-height: 0px !important; /* hero 最小高度 */
  max-height: 520px !important; /* hero 最大高度 */

  padding-top: 52px !important; /* hero 上方空间 */
  padding-right: 20px !important; /* hero 右边空间 */
  padding-bottom: 48px !important; /* hero 下方空间 */
  padding-left: 20px !important; /* hero 左边空间 */

  margin-top: 0px !important; /* hero 和 navbar 距离 */
  margin-right: calc(50% - 50vw) !important; /* 贴齐手机右边 */
  margin-bottom: 0px !important; /* hero 和下面 section 距离 */
  margin-left: calc(50% - 50vw) !important; /* 贴齐手机左边 */

  background:
    linear-gradient(
      180deg,
      rgba(255, 248, 238, 0.82) 0%,
      rgba(255, 248, 238, 0.55) 38%,
      rgba(255, 248, 238, 0.12) 100%
    ),
    url("assets/products-hero-mobile.png") !important; /* Product hero 图片 link */

  background-size: cover !important; /* 图片填满 hero */
  background-position: center bottom !important; /* 图片位置 */
  background-repeat: no-repeat !important; /* 图片不重复 */

  border-radius: 0 !important; /* mobile 不要圆角 */
  box-sizing: border-box !important; /* padding 不撑爆 */
  overflow: hidden !important; /* 防止图片跑出 */
}

/* Hero 旧 overlay 关闭 */
section.product-mobile-hero.page-hero.section-pad.reveal::before,
section.product-mobile-hero.page-hero.section-pad.reveal::after {
  display: none !important; /* 关闭旧遮罩 */
  content: none !important; /* 清掉旧内容 */
  background: none !important; /* 清掉旧背景 */
}

/* Hero container */
section.product-mobile-hero.page-hero.section-pad.reveal .container {
  position: relative !important; /* 让 container 可以移动 */
  left: 0px !important; /* container 左右移动 */
  top: 0px !important; /* container 上下移动 */

  width: 100% !important; /* container 宽度 */
  max-width: 100% !important; /* 不超过手机 */

  margin: 0 auto !important; /* 居中 */
  padding: 0 !important; /* 清掉旧 padding */

  z-index: 2 !important; /* 文字在背景图上面 */
}

/* Hero 文字整组 */
section.product-mobile-hero.page-hero.section-pad.reveal .hero-copy,
section.product-mobile-hero.page-hero.section-pad.reveal .page-hero-copy {
  position: relative !important; /* 让文字整组可以移动 */
  left: 0px !important; /* 文字左右移动 */
  top: 0px !important; /* 文字上下移动 */

  width: 100% !important; /* 文字区宽度 */
  max-width: 340px !important; /* 文字区最大宽度 */

  margin: 0 !important; /* 清掉外距 */
  padding: 0 !important; /* 清掉内距 */

  text-align: left !important; /* 文字靠左 */
}

/* Hero 小字 */
section.product-mobile-hero.page-hero.section-pad.reveal .eyebrow {
  position: relative !important; /* 让小字可以移动 */
  left: -10px !important; /* 小字左右移动 */
  top: -150px !important; /* 小字上下移动 */

  color: #f26a2e !important; /* 小字颜色 */
  font-size: 13px !important; /* 小字大小 */
  font-weight: 900 !important; /* 小字粗细 */
  line-height: 1.4 !important; /* 小字行高 */
  letter-spacing: 0.18em !important; /* 小字字距 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 10px !important; /* 小字和标题距离 */
}

/* Hero 大标题 */
section.product-mobile-hero.page-hero.section-pad.reveal h1 {
  position: relative !important; /* 让标题可以移动 */
  left: 0px !important; /* 标题左右移动 */
  top: -150px !important; /* 标题上下移动 */

  color: #174d32 !important; /* 标题颜色 */
  font-size: 36px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.02 !important; /* 标题行高 */
  letter-spacing: -0.03em !important; /* 标题字距 */

  width: 340px !important; /* 标题最大宽度 */

  margin-top: 0 !important; /* 标题上方距离 */
  margin-bottom: 14px !important; /* 标题和说明距离 */

  text-align: left !important; /* 标题靠左 */
}

/* Hero 说明文字 */
section.product-mobile-hero.page-hero.section-pad.reveal .product-hero-note p {
  position: relative !important; /* 让说明文字可以移动 */
  left: 140px !important; /* 说明左右移动 */
  top: -170px !important; /* 说明上下移动 */

  color: #5b6858 !important; /* 说明文字颜色 */
  font-size: 14px !important; /* 说明文字大小 */
  font-weight: 500 !important; /* 说明文字粗细 */
  line-height: 1.65 !important; /* 说明文字行高 */

  width: 335px !important; /* 说明最大宽度 */

  margin-top: 0 !important; /* 上方距离 */
  margin-bottom: 0 !important; /* 下方距离 */

  text-align: left !important; /* 文字靠左 */
}

/* Hero button 整组 */
section.product-mobile-hero.page-hero.section-pad.reveal .hero-actions {
  position: relative !important; /* 让按钮整组可以移动 */
  left: 0px !important; /* 按钮左右移动 */
  top: 18px !important; /* 按钮上下移动 */

  display: flex !important; /* 显示按钮 */
  flex-direction: column !important; /* mobile 上下排 */
  align-items: flex-start !important; /* 按钮靠左 */
  gap: 10px !important; /* 按钮之间距离 */

  margin: 0 !important; /* 清掉外距 */
  padding: 0 !important; /* 清掉内距 */
}

/* Hero button */
section.product-mobile-hero.page-hero.section-pad.reveal .hero-actions .btn,
section.product-mobile-hero.page-hero.section-pad.reveal .hero-actions a {
  width: 170px !important; /* 按钮宽度 */
  min-width: 170px !important; /* 按钮最小宽度 */
  height: 42px !important; /* 按钮高度 */
  min-height: 42px !important; /* 按钮最小高度 */

  display: inline-flex !important; /* 让文字居中 */
  align-items: center !important; /* 文字上下居中 */
  justify-content: center !important; /* 文字左右居中 */

  border-radius: 999px !important; /* 按钮圆角 */
  background: #174d32 !important; /* 按钮背景 */
  color: #ffffff !important; /* 按钮文字 */

  font-size: 14px !important; /* 按钮文字大小 */
  font-weight: 900 !important; /* 按钮文字粗细 */
  text-align: center !important; /* 文字居中 */
  text-decoration: none !important; /* 去掉底线 */

  border: none !important; /* 去掉边框 */
  box-shadow: 0 12px 28px rgba(23, 77, 50, 0.16) !important; /* 按钮阴影 */
}

/* 整个 Categories topbar */
section.products-with-sidebar .category-topbar {
  position: relative !important; /* 让整个 category 区可以移动 */
  left: 0px !important; /* 整块左右移动 */
  top: 0px !important; /* 整块上下移动 */

  width: 100% !important; /* 宽度 */
  max-width: 100% !important; /* 不超过手机 */

  padding-top: 18px !important; /* 里面上方空间 */
  padding-right: 16px !important; /* 里面右边空间 */
  padding-bottom: 18px !important; /* 里面下方空间 */
  padding-left: 16px !important; /* 里面左边空间 */

  margin-top: 0px !important; /* 跟上面距离 */
  margin-right: 0px !important; /* 右边距离 */
  margin-bottom: 22px !important; /* 跟产品列表距离 */
  margin-left: 0px !important; /* 左边距离 */

  border-radius: 22px !important; /* 圆角 */
  background: none!important; /* 背景 */
  border: 0px solid rgba(23, 77, 50, 0.12) !important; /* 边框 */
  box-shadow: 0 0px 0px rgba(23, 77, 50, 0.07) !important; /* 阴影 */

  box-sizing: border-box !important; /* padding 不撑爆 */
  overflow: visible !important; /* 不切掉按钮 */
}

/* CATEGORIES 标题 */
section.products-with-sidebar .category-topbar h3 {
  position: relative !important; /* 让标题可以移动 */
  left: -450px !important; /* 标题左右移动 */
  top: 0px !important; /* 标题上下移动 */

  color: #f26a2e !important; /* 标题颜色 */
  font-size: 17px !important; /* 标题大小 */
  font-weight: 900 !important; /* 标题粗细 */
  line-height: 1.2 !important; /* 标题行高 */
  letter-spacing: 0.08em !important; /* 字距 */

  margin-top: 0px !important; /* 标题上方距离 */
  margin-right: 0px !important; /* 标题右边距离 */
  margin-bottom: 14px !important; /* 标题和按钮距离 */
  margin-left: 0px !important; /* 标题左边距离 */

  text-align: left !important; /* 标题靠左 */
  text-transform: uppercase !important; /* 大写 */
}

/* category button 整排 */
/* Category 按钮横向 scrolling */
section.products-with-sidebar .category-button-row {
  position: relative !important; /* 让整排按钮可以移动 */
  left: -12px !important; /* 整排左右移动 */
  top: 0px !important; /* 整排上下移动 */

  width:420px !important; /* 宽度 */
  max-width: 420px !important; /* 不超过手机宽度 */

  display: flex !important; /* 横向排列 */
  flex-direction: row !important; /* 横排 */
  flex-wrap: nowrap !important; /* 不换行，重点 */
  align-items: center !important; /* 上下居中 */
  justify-content: flex-start !important; /* 从左开始 */

  gap: 10px !important; /* 按钮之间距离 */

  overflow-x: auto !important; /* 横向 scroll，重点 */
  overflow-y: hidden !important; /* 不要上下 scroll */

  -webkit-overflow-scrolling: touch !important; /* 手机滑动顺一点 */

  padding-top: 10px !important; /* 上方空间 */
  padding-right: 0px !important; /* 右边留一点空间 */
  padding-bottom: 8px !important; /* 下方空间，避免 scrollbar 贴太近 */
  padding-left: 0px !important; /* 左边空间 */

  margin-top: 0px !important; /* 上方距离 */
  margin-bottom: 0px !important; /* 下方距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
  
}

/* 每个 category button */
section.products-with-sidebar .gp-category-btn {
  flex: 0 0 auto !important; /* 不压缩，不换行，重点 */

  width: auto !important; /* 宽度跟文字 */
  min-width: 128px !important; /* 最小宽度 */
  height: 40px !important; /* 按钮高度 */
  min-height: 40px !important; /* 最小高度 */

  padding-left: 16px !important; /* 左边空间 */
  padding-right: 16px !important; /* 右边空间 */

  white-space: nowrap !important; /* 文字不换行 */
}

/* 横向 scroll 按钮排 */
section.products-with-sidebar .category-button-row {
  overflow-x: auto !important; /* 横向 scroll */
  overflow-y: hidden !important; /* 不要上下 scroll */

  scrollbar-width: thin !important; /* Firefox scrollbar 粗细 */
  scrollbar-color: #ef7128 rgba(218, 50, 237, 0.852) !important; /* Firefox scrollbar 颜色 */

  padding-bottom: 10px !important; /* 给 scrollbar 空间 */
}

/* Chrome / Edge / Safari scrollbar 高度 */
section.products-with-sidebar .category-button-row::-webkit-scrollbar {
  height: 6px !important; /* scrollbar 高度 */
}

/* scrollbar 背景轨道 */
section.products-with-sidebar .category-button-row::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.175) !important; /* 轨道颜色 */
  border-radius: 999px !important; /* 轨道圆角 */
}

/* scrollbar 滑块 */
section.products-with-sidebar .category-button-row::-webkit-scrollbar-thumb {
  background: #174d32 !important; /* 滑块颜色 */
  border-radius: 999px !important; /* 滑块圆角 */
}

/* scrollbar 滑块 hover */
section.products-with-sidebar .category-button-row::-webkit-scrollbar-thumb:hover {
  background: #f26a2e !important; /* hover 颜色 */
}

/* active button */
section.products-with-sidebar .gp-category-btn.active {
  background: #174d32 !important; /* active 背景 */
  color: #ffffff !important; /* active 文字 */
  border-color: #174d32 !important; /* active 边框 */
  box-shadow: 0 0px 0px rgba(23, 77, 50, 0.18) !important; /* active 阴影 */
}

/* button hover */
section.products-with-sidebar .gp-category-btn:hover,
section.products-with-sidebar .gp-category-btn:focus {
  background: #174d32 !important; /* hover 背景 */
  color: #ffffff !important; /* hover 文字 */
  border-color: #174d32 !important; /* hover 边框 */
}

/* ===== PRODUCT CARD HORIZONTAL SLIDER 361-400 START ===== */
/* 不是 active 的 category 隐藏 */
section.products-with-sidebar .gp-product-section {
  display: none !important;
}

/* active category：产品卡片横向 slide */
section.products-with-sidebar .gp-product-section.active {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;

  overflow-x: auto !important;
  overflow-y: hidden !important;

  padding-top: 0 !important;
  padding-right: 20px !important;
  padding-bottom: 18px !important;
  padding-left: 0 !important;

  margin: 0 !important;

  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;

  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* 每一张产品 card */
section.products-with-sidebar .gp-product-section.active > article.shop-card {
  flex: 0 0 84% !important; /* 卡片宽度：越大越宽 */
  width: 84% !important;
  max-width: 320px !important;

  scroll-snap-align: start !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}

/* card 里面木框 */
section.products-with-sidebar .gp-product-section.active .wood-card-inner {
  width: 100% !important;
  height: 650px !important;

  padding: 16px !important;

  border-radius: 26px !important;
  background: rgba(255, 255, 255, 0.86) !important;
  border: 1px solid rgba(23, 77, 50, 0.12) !important;
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.08) !important;

  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* 产品图片框 */
section.products-with-sidebar .gp-product-section.active .product-image.real-card-image {
  position: relative !important;

  width: 220px !important; /* 图片框宽度，自己改 */
  height: 220px !important; /* 图片框高度，自己改 */

  min-width: 220px !important;
  min-height: 220px !important;
  max-width: 220px !important;
  max-height: 220px !important;

  margin-top: 0 !important;
  margin-right: auto !important;
  margin-bottom: 14px !important;
  margin-left: auto !important;

  padding: 10px !important;

  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(23, 77, 50, 0.10) !important;

  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* 产品图片本身 */
section.products-with-sidebar .gp-product-section.active .product-image.real-card-image img.card-product-photo {
  width: 100% !important;
  height: 100% !important;

  object-fit: contain !important;
  object-position: center center !important;

  display: block !important;
}

/* Free Shipping */
section.products-with-sidebar .gp-product-section.active .shipping-ribbon {
  position: relative !important;
  top: 200px !important;
  right: 10px !important;
  z-index: 3 !important;
  display: none !important;

}

/* 产品文字区 */
section.products-with-sidebar .gp-product-section.active .shop-card-body {
  width: 100% !important;
  max-width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  text-align: left !important;
}

/* Available Now */
section.products-with-sidebar .gp-product-section.active .mini-tag {
  display: inline-flex !important;

  margin-bottom: 10px !important;

  color: #f26a2e !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

/* 产品标题 */
section.products-with-sidebar .gp-product-section.active .shop-card-body h3 {
  color: #174d32 !important;

  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;

  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

/* 产品描述 */
section.products-with-sidebar .gp-product-section.active .shop-card-body p {
  color: #5b6858 !important;

  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;

  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* 产品 list */
section.products-with-sidebar .gp-product-section.active .mini-list {
  padding-left: 18px !important;

  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

section.products-with-sidebar .gp-product-section.active .mini-list li {
  color: #5b6858 !important;

  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;

  margin-bottom: 4px !important;
}

/* 按钮区 */
section.products-with-sidebar .gp-product-section.active .card-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;

  margin-top: 12px !important;
  margin-bottom: 0 !important;
}

/* 按钮 */
section.products-with-sidebar .gp-product-section.active .card-actions .btn {
  width: 170px !important;
  min-width: 170px !important;

  position: relative !important;
  left: 60px !important;
  top: 0px !important; 

  height: 42px !important;
  min-height: 42px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;

  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
}

/* View Details */
section.products-with-sidebar .gp-product-section.active .card-actions .btn-primary {
  background: #174d32 !important;
  color: #ffffff !important;
  border: none !important;
}

/* WhatsApp */
section.products-with-sidebar .gp-product-section.active .card-actions .btn-secondary {
  background: rgba(255, 255, 255, 0.86) !important;
  color: #174d32 !important;
  border: 1px solid rgba(23, 77, 50, 0.14) !important;
}

/* 横向 scrollbar */
section.products-with-sidebar .gp-product-section.active::-webkit-scrollbar {
  height: 7px !important;
}

section.products-with-sidebar .gp-product-section.active::-webkit-scrollbar-track {
  background: rgba(23, 77, 50, 0.10) !important;
  border-radius: 999px !important;
}

section.products-with-sidebar .gp-product-section.active::-webkit-scrollbar-thumb {
  background: #174d32 !important;
  border-radius: 999px !important;
}

section.products-with-sidebar .gp-product-section.active {
  scrollbar-width: thin !important;
  scrollbar-color: #174d32 rgba(23, 77, 50, 0.10) !important;
}
/* ===== PRODUCT CARD HORIZONTAL SLIDER 361-400 END ===== */

/* ===== PRODUCT DETAIL HERO IMAGE 361-400 START ===== */

/* 整个 Product Detail Hero */
section.product-detail-hero.section-pad.reveal.is-visible {
  position: relative !important; /* 让整个 hero 可以移动 */
  width: 100% !important; /* hero 宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  padding-top: 42px !important; /* hero 上方空间 */
  padding-right: 20px !important; /* hero 右边空间 */
  padding-bottom: 42px !important; /* hero 下方空间 */
  padding-left: 20px !important; /* hero 左边空间 */

  margin-top: 0px !important; /* hero 跟 navbar 距离 */
  margin-bottom: 0px !important; /* hero 跟下面内容距离 */

  box-sizing: border-box !important; /* padding 不撑爆 */
  overflow: visible !important; /* 不切掉图片 */
}

/* Hero 里面的图片外框 */
section.product-detail-hero.section-pad.reveal.is-visible .product-image,
section.product-detail-hero.section-pad.reveal.is-visible .product-detail-image,
section.product-detail-hero.section-pad.reveal.is-visible .product-detail-media,
section.product-detail-hero.section-pad.reveal.is-visible .product-visual,
section.product-detail-hero.section-pad.reveal.is-visible figure {
  position: relative !important; /* 让图片框可以移动 */
  left: 0px !important; /* 图片框左右移动：正数往右，负数往左 */
  top: 0px !important; /* 图片框上下移动：正数往下，负数往上 */

  width: 260px !important; /* 图片框宽度 */
  height: 260px !important; /* 图片框高度 */

  min-width: 260px !important; /* 图片框最小宽度 */
  min-height: 260px !important; /* 图片框最小高度 */
  max-width: 260px !important; /* 图片框最大宽度 */
  max-height: 260px !important; /* 图片框最大高度 */

  margin-top: 0px !important; /* 图片框上方距离 */
  margin-right: auto !important; /* 图片框居中 */
  margin-bottom: 22px !important; /* 图片框和文字距离 */
  margin-left: auto !important; /* 图片框居中 */

  padding: 12px !important; /* 图片和框边缘距离 */

  border-radius: 24px !important; /* 图片框圆角 */
  background: rgba(255, 255, 255, 0.82) !important; /* 图片框背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 图片框边框 */
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.08) !important; /* 图片框阴影 */

  overflow: hidden !important; /* 图片不要跑出框 */
  box-sizing: border-box !important; /* padding 不撑爆 */
}

/* Product Detail 主图片框 */
section.product-detail-hero.section-pad.reveal.is-visible .main-product-photo.real-product-photo {
  position: relative !important; /* 让图片框可以移动 */
  left: 0px !important; /* 图片框左右移动 */
  top: 0px !important; /* 图片框上下移动 */

  width: 260px !important; /* 图片框宽度 */
  height: 260px !important; /* 图片框高度 */

  margin-left: auto !important; /* 居中 */
  margin-right: auto !important; /* 居中 */

  overflow: hidden !important; /* 图片不要跑出框 */
}

/* Product Detail 主图片本身 */
section.product-detail-hero.section-pad.reveal.is-visible .main-product-photo.real-product-photo img {
  position: relative !important; /* 让图片框可以移动 */
  left: 0px !important; /* 图片框左右移动：正数往右，负数往左 */
  top: -80px !important; /* 图片框上下移动：正数往下，负数往上 */

  width: 100% !important; /* 图片宽度 */
  height: 100% !important; /* 图片高度 */

  object-fit: contain !important; /* 完整显示产品 */
  object-position: center center !important; /* 图片位置 */

  display: block !important;
}

/* Product Detail 图片 grid：左右 scroll */
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid {
  position: relative !important; /* 让整个图片区可以移动 */
  left: 0px !important; /* 整个图片区左右移动 */
  top: 0px !important; /* 整个图片区上下移动 */

  width: 100% !important; /* 图片区宽度 */
  max-width: 100% !important; /* 不超过手机宽度 */

  display: flex !important; /* 横向排列图片 */
  flex-direction: row !important; /* 左右排 */
  flex-wrap: nowrap !important; /* 不换行，重点 */

  gap: 14px !important; /* 图片之间距离 */

  overflow-x: auto !important; /* 左右 scroll */
  overflow-y: hidden !important; /* 不要上下 scroll */

  scroll-snap-type: x mandatory !important; /* 滑动吸附 */
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;

  padding-top: 0px !important;
  padding-right: 20px !important; /* 右边留空间 */
  padding-bottom: 16px !important; /* 给 scrollbar 空间 */
  padding-left: 0px !important;

  margin-top: 0px !important;
  margin-right: 0px !important;
  margin-bottom: 22px !important; /* 图片区和下面内容距离 */
  margin-left: 0px !important;

  box-sizing: border-box !important;
}

/* 每个图片框 */
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid .main-product-photo.real-product-photo,
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid .product-photo,
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid figure {
  flex: 0 0 82% !important; /* 每张图片框宽度，越大越宽 */
  width: 82% !important;
  max-width: 310px !important;

  scroll-snap-align: start !important; /* 滑动时靠左停 */

  position: relative !important;
  left: 0px !important;
  top: 0px !important;

  aspect-ratio: 1 / 1 !important; /* 图片框比例 */
  height: auto !important;

  padding: 12px !important;

  margin: 0 !important;

  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  border: 1px solid rgba(23, 77, 50, 0.12) !important;
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.08) !important;

  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* 图片本身 */
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid img,
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid img.card-product-photo {
  width: 100% !important;
  height: 100% !important;
  height: 170px !important;


  object-fit: contain !important; /* 完整显示产品 */
  object-position: center center !important;

  display: block !important;
}

/* scrollbar */
section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid::-webkit-scrollbar {
  height: 7px !important;
}

section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid::-webkit-scrollbar-track {
  background: rgba(23, 77, 50, 0.10) !important;
  border-radius: 999px !important;
}

section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid::-webkit-scrollbar-thumb {
  background: #174d32 !important;
  border-radius: 999px !important;
}

section.product-detail-hero.section-pad.reveal.is-visible .product-photo-grid {
  scrollbar-width: thin !important;
  scrollbar-color: #174d32 rgba(23, 77, 50, 0.10) !important;
}

/* ===== PRODUCT DETAIL HERO IMAGE END ===== */

/* ===== PRODUCT DETAIL INFO PANEL START ===== */

/* Product Detail 文字信息面板 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel {
  position: relative !important; /* 让资料面板可以移动 */
  left: 0px !important; /* 资料面板左右移动 */
  top: 0px !important; /* 资料面板上下移动 */

  width: 100% !important; /* 面板宽度 */
  max-width: 100% !important; /* 不超过手机 */

  padding-top: 22px !important; /* 面板里面上方空间 */
  padding-right: 18px !important; /* 面板里面右边空间 */
  padding-bottom: 22px !important; /* 面板里面下方空间 */
  padding-left: 18px !important; /* 面板里面左边空间 */

  margin-top: 0px !important; /* 面板上方距离 */
  margin-right: 0px !important;
  margin-bottom: 0px !important; /* 面板下方距离 */
  margin-left: 0px !important;

  border-radius: 24px !important; /* 面板圆角 */
  background: rgba(255, 255, 255, 0.86) !important; /* 面板背景 */
  border: 1px solid rgba(23, 77, 50, 0.12) !important; /* 面板边框 */
  box-shadow: 0 16px 38px rgba(23, 77, 50, 0.08) !important; /* 面板阴影 */

  box-sizing: border-box !important;
}

/* 小标签 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .mini-tag,
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .eyebrow {
  color: #f26a2e !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.16em !important;

  margin-bottom: 10px !important;
}

/* 产品标题 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel h1,
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel h2 {
  color: #174d32 !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;

  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* 描述文字 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel p {
  color: #5b6858 !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;

  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

/* 规格 list */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel ul,
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .mini-list {
  padding-left: 18px !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
}

/* 规格每一行 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel li {
  color: #5b6858 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;

  margin-bottom: 5px !important;
}

/* 按钮区域 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .card-actions,
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .hero-actions,
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .product-actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;

  margin-top: 16px !important;
  margin-bottom: 0 !important;
}

/* 按钮 */
section.section-pad.product-detail-hero.reveal.is-visible .product-info-panel .btn {
  position: relative !important;
  left: 75px !important; 
  top: 0px !important; 

  width: 190px !important;
  min-width: 190px !important;
  height: 44px !important;
  min-height: 44px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;

  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
}

/* ===== PRODUCT DETAIL INFO PANEL 361-400 END ===== */


/* ===== PRODUCT FULL CONTROL END ============================================================================================== */

/* ===== COMPARISON HERO START ========================================================================================================================= */

/* 整个 Comparison Hero */
body.comparison-page section.page-hero.section-pad.reveal,
body.comparison-page section.comparison-hero.section-pad.reveal,
section.comparison-hero.page-hero.section-pad.reveal {
  position: relative !important;
  left: 0px !important;
  top: 0px !important;

  width: 100vw !important;
  max-width: 100vw !important;

  height: 500px !important;
  min-height: 400px !important;
  max-height: 520px !important;

  padding-top: 52px !important;
  padding-right: 20px !important;
  padding-bottom: 42px !important;
  padding-left: 20px !important;

  margin-top: 0px !important;
  margin-right: calc(50% - 50vw) !important;
  margin-bottom: 0px !important;
  margin-left: calc(50% - 50vw) !important;

  background:
    linear-gradient(
      180deg,
      rgba(255, 248, 238, 0.84) 0%,
      rgba(255, 248, 238, 0.56) 40%,
      rgba(255, 248, 238, 0.14) 100%
    ),
    url("assets/comparison-hero-mobile.png") !important; /* Comparison hero 图片 */

  background-size: cover !important;
  background-position: center bottom !important;
  background-repeat: no-repeat !important;

  border-radius: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* 关闭旧 overlay */
body.comparison-page section.page-hero.section-pad.reveal::before,
body.comparison-page section.page-hero.section-pad.reveal::after,
body.comparison-page section.comparison-hero.section-pad.reveal::before,
body.comparison-page section.comparison-hero.section-pad.reveal::after,
section.comparison-hero.page-hero.section-pad.reveal::before,
section.comparison-hero.page-hero.section-pad.reveal::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* Hero container */
body.comparison-page section.page-hero.section-pad.reveal .container,
body.comparison-page section.comparison-hero.section-pad.reveal .container,
section.comparison-hero.page-hero.section-pad.reveal .container {
  position: relative !important;
  left: 0px !important;
  top: 0px !important;

  width: 100% !important;
  max-width: 100% !important;

  margin: 0 auto !important;
  padding: 0 !important;

  z-index: 2 !important;
  box-sizing: border-box !important;
}

/* Hero 文字整组 */
body.comparison-page section.page-hero.section-pad.reveal .hero-copy,
body.comparison-page section.page-hero.section-pad.reveal .page-hero-copy,
body.comparison-page section.comparison-hero.section-pad.reveal .hero-copy,
body.comparison-page section.comparison-hero.section-pad.reveal .page-hero-copy,
section.comparison-hero.page-hero.section-pad.reveal .hero-copy,
section.comparison-hero.page-hero.section-pad.reveal .page-hero-copy {
  position: relative !important;
  left: 0px !important;
  top: 0px !important;

  width: 100% !important;
  max-width: 340px !important;

  margin: 0 !important;
  padding: 0 !important;

  text-align: left !important;
  z-index: 3 !important;
}

/* 小字 */
body.comparison-page section.page-hero.section-pad.reveal .eyebrow,
body.comparison-page section.comparison-hero.section-pad.reveal .eyebrow,
section.comparison-hero.page-hero.section-pad.reveal .eyebrow {
  position: relative !important;
  left: 30px !important;
  top: -20px !important;

  color: #f26a2e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.18em !important;

  margin-top: 0 !important;
  margin-bottom: 10px !important;

  text-transform: uppercase !important;
}

/* 大标题 */
body.comparison-page section.page-hero.section-pad.reveal h1,
body.comparison-page section.comparison-hero.section-pad.reveal h1,
section.comparison-hero.page-hero.section-pad.reveal h1 {
  position: relative !important;
  left: 35px !important;
  top: -20px !important;

  color: #174d32 !important;
  font-size: 35px !important;
  font-weight: 900 !important;
  line-height: 1.03 !important;
  letter-spacing: -0.03em !important;

  max-width: 340px !important;

  margin-top: 0 !important;
  margin-bottom: 14px !important;

  text-align: left !important;
}

/* 说明文字 */
body.comparison-page section.page-hero.section-pad.reveal p,
body.comparison-page section.comparison-hero.section-pad.reveal p,
section.comparison-hero.page-hero.section-pad.reveal p {
  position: relative !important;
  left: 35px !important;
  top: -20px !important;

  color: #5b6858 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;

  max-width: 335px !important;

  margin-top: 0 !important;
  margin-bottom: 0 !important;

  text-align: left !important;
}

/* 按钮整组 */
body.comparison-page section.page-hero.section-pad.reveal .hero-actions,
body.comparison-page section.comparison-hero.section-pad.reveal .hero-actions,
section.comparison-hero.page-hero.section-pad.reveal .hero-actions {
  position: relative !important;
  left: 0px !important;
  top: 18px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* 按钮 */
body.comparison-page section.page-hero.section-pad.reveal .hero-actions .btn,
body.comparison-page section.comparison-hero.section-pad.reveal .hero-actions .btn,
section.comparison-hero.page-hero.section-pad.reveal .hero-actions .btn {
  width: 170px !important;
  min-width: 170px !important;

  height: 42px !important;
  min-height: 42px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  background: #174d32 !important;
  color: #ffffff !important;

  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;

  border: none !important;
  box-shadow: 0 12px 28px rgba(23, 77, 50, 0.16) !important;
}

/* ===== COMPARISON HERO END ==================================================================================================================== */